import React from "react";
import {Route, Redirect} from "react-router-dom";
import { Carousel ,DatePicker } from 'antd';
import Home from "./com/Home.jsx";
import Search from "./com/Search.jsx";
import SearchHeader from "./com/SearchHeader.jsx";
import HomeHeader from "./com/HomeHeader.jsx";
import MainFooter from "./com/MainFooter.jsx";
import product from "./com/product.jsx";
import productHeader from "./com/productHeader.jsx";
import brandHeader from "./com/brandHeader.jsx";
import brand from "./com/brand.jsx";
import brandFooter from "./com/brandFooter.jsx";
import cart from "./com/cart.jsx";
import cartHeader from "./com/cartHeader.jsx";
class App extends React.Component {
	render () {
		return (
			<div className = 'container'>
				<header id="header">
					<Route path="/" exact component={HomeHeader}/>
					<Route path= '/home' component = {HomeHeader} />
					<Route path= '/search' component = {SearchHeader} />
					<Route path= '/product' component = {productHeader} />
					<Route path= '/brand' component = {brandHeader} />
					<Route path= '/cart' component = {cartHeader} />
				</header>
				<div id="content">
					<Route path="/" exact component={Home}/>			
					<Route path = "/home" component = {Home} />
					<Route path="/search" component = {Search} />
					<Route path="/product" component = {product} />
					<Route path="/brand" component = {brand} />
					<Route path="/cart" component = {cart} />
				</div>
				<footer id="footer">
					<Route path="/home" component = {MainFooter} />
					<Route path="/user" component = {MainFooter} />
					<Route path="/product" component = {MainFooter} />
					<Route path="/brand" component = {brandFooter} />
				</footer>
			</div>
		)
	}
}

export default App;
